$(function () {
    $(window).scroll(function () {
        setTimeout(function () {
            if ($(window).scrollTop() > 450) {//这里100代表你要动画的元素离最顶层的距离，console.log一下就知道了。
                console.log($(window).scrollTop());
                $('.box-bottom-logo').css({
                    'transform': 'translateX(0)',
                    'opacity': '1',
                })
            } else {
            }
        }, 500);
        setTimeout(function () {
            if ($(window).scrollTop() > 450) {//这里100代表你要动画的元素离最顶层的距离，console.log一下就知道了。
                $('#ul1').css({
                    'transform': 'translateX(0)',
                    'opacity': '1',
                })
            } else {
                $('#ul1').css({
                })
            }
        }, 500);
        setTimeout(function () {
            if ($(window).scrollTop() > 500) {//这里100代表你要动画的元素离最顶层的距离，console.log一下就知道了。
                $('#img11').css({
                    'transform': 'translateX(0)',
                    'opacity': '1',
                })
            } else {
                $('#img11').css({
                })
            }
        }, 1100);

        setTimeout(function () {
            if ($(window).scrollTop() > 500) {//这里100代表你要动画的元素离最顶层的距离，console.log一下就知道了。
                $('#img12').css({
                    'transform': 'translateX(0)',
                    'opacity': '1',
                })
            } else {
                $('#img12').css({
                })
            }
        }, 1300);
        setTimeout(function () {
            if ($(window).scrollTop() > 500) {//这里100代表你要动画的元素离最顶层的距离，console.log一下就知道了。
                $('#img13').css({
                    'transform': 'translateX(0)',
                    'opacity': '1',
                })
            } else {
                $('#img13').css({
                })
            }
        }, 1500);
        setTimeout(function () {
            if ($(window).scrollTop() > 500) {//这里100代表你要动画的元素离最顶层的距离，console.log一下就知道了。
                $('#img14').css({
                    'transform': 'translateX(0)',
                    'opacity': '1',
                })
            } else {
                $('#img14').css({
                })
            }
        }, 1500);
        setTimeout(function () {
            if ($(window).scrollTop() > 550) {//这里100代表你要动画的元素离最顶层的距离，console.log一下就知道了。
                $('#text1').css({
                    'transform': 'translateX(0)',
                    'opacity': '1',
                })
            } else {
                $('#text1').css({
                })
            }
        }, 2100);
        setTimeout(function () {
            if ($(window).scrollTop() > 550) {//这里100代表你要动画的元素离最顶层的距离，console.log一下就知道了。
                $('#text2').css({
                    'transform': 'translateX(0)',
                    'opacity': '1',
                })
            } else {
                $('#text2').css({
                })
            }
        }, 2400)

    })
    var top = $('.nav').offset().top;
    $(window).scroll(function () {
        if ($(window).scrollTop() > top) {
            $('.nav').addClass('nav1');
            $('.top').addClass('top1');
            $('.hide1').addClass('hide');

        } else {
            $('.nav').removeClass('nav1');
            $('.top').removeClass('top1');
            $('.hide1').removeClass('hide');
        }
    })
})
$('.tob2').click(function () {
    $('#tabulation').toggle();
})
$('#i1').click(function () {
    $('.talu1').hide()
    $('.talu2').show()
})
$('#i2').click(function () {
    $('.talu2').hide()
    $('.talu1').show()
})
var hide3 = document.getElementById('hide3')
var hide = document.getElementById('hide1')
hide3.addEventListener('mouseover', function () {
    hide.style.display = 'block'
})
hide3.addEventListener('mouseout', function () {
    hide.style.display = 'none'
})
hide.addEventListener('mouseover', function () {
    this.style.display = 'block'
})
hide.addEventListener('mouseout', function () {
    this.style.display = 'none'
})